<template>
  <div>
    <h1>首页</h1>
    <router-link to="/news">新闻</router-link>
    <button @click="addCount">count+</button>
    {{ $store.state.count }}
    <br>
    {{ $store.getters.doubleCount }}

    <ul>
      <li v-for="cate in $store.state.cates" :key="cate.id">
        <h5>{{ cate.name }}</h5>
        <img :src="cate.icon" width="80" alt="">
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'HomePage',
  mounted () {
    console.log(this.$store)
  },
  methods: {
    addCount () {
      this.$store.commit('ADD_NUM', 5)
    }
  },
  created () {
    this.$store.dispatch('FETCH_CATES', { page: 1, pageSize: 10 })
  }
}
</script>

<style lang="scss" scoped>

</style>
